<template>
    <div>
        <!-- 九楼 页面跳转模块 -->
      <div class="foot-top">
        <div class="foot-top-ul">
          <div class="foot-top-1">
            <ul>
              <a href="01_index.html"><h3>关于中科东方</h3></a>
              <a href="02_second.html"> <li>公司介绍</li></a>
              <a href="expert-main.html"><li>专家介绍</li></a>
              <a href="02.html"><li>产业规划</li></a>
              <a href=""><li>企业文化</li></a>
              <a href="honour-main .html"> <li>荣誉资质</li></a>
              <a href="contact-main .html"><li>联系方式</li></a>
              <a href="join-main.html"><li>加入我们</li></a>
            </ul>
          </div>
          <div class="foot-top-2">
            <ul>
              <a href="">
                <h3>声明银行</h3>
              </a>
              <a href="03_third.html"> <li>围产期干细胞</li></a>
              <a href="04_immunity.html"><li>免疫细胞</li></a>
              <a href="05_adult.html"><li>成体干细胞</li></a>
              <a href="06_fibre.html"><li>成纤维细胞</li></a>
            </ul>
          </div>
          <div class="foot-top-3">
            <ul>
              <a href="">
                <h3>应用转化</h3>
              </a>
              <a href=""> <li>科研服务</li></a>
              <a href=""><li>科研试剂</li></a>
              <a href=""><li>生物美容</li></a>
              <a href=""><li>健康管理</li></a>
              <a href=""><li>仪器开发</li></a>
            </ul>
          </div>
          <div class="foot-top-4">
            <ul>
              <a href="">
                <h3>新药研发</h3>
              </a>
            </ul>
          </div>
          <div class="foot-top-5">
            <ul>
              <a href="">
                <h3>新闻中心</h3>
              </a>
              <a href="xw.html"><li>公司动态</li></a>
              <a href="xw1.html"><li>行业政策</li></a>
              <a href="xw2.html"><li>行业前沿</li></a>
              <a href="xw3.html"><li>社会责任</li></a>
            </ul>
          </div>
          <div class="foot-top-6">
            <ul>
              <a href="">
                <h3>客户服务</h3>
              </a>
              <a href="kehu.html"><li>年检报告</li></a>
              <a href="kehu.html"><li>订单查询</li></a>
              <a href="kehu.html"><li>在线咨询</li></a>
            </ul>
          </div>
        </div>
        <div class="foot-top-right">
          <h3>0750-7152806</h3>
          <p>江门总部联系方式</p>
          <div class="foot-top-text">友情链接</div>
        </div>
      </div>
<div class="foot">
        <div class="foot-left">
          <img src="../assets/image/qq.png" alt="" />
          <img src="../assets/image/wechat.png" alt="" />
          <img src="../assets/image/weibo.png" alt="" />
          <p>
            COPYRIGHT ©2021 中科东方细胞科技有限公司 粤ICP备2022040694号
            .POWERED BY VANCHEER
          </p>
          <ul>
            <a href=""
              ><li>网站地图<span>|</span></li></a
            >
            <a href="">
              <li>联系方式<span>|</span></li></a
            >
            <a href=""
              ><li>隐私条款<span>|</span></li></a
            >
            <a href=""><li>法律声明</li></a>
          </ul>
        </div>
        <div class="foot-right">
          <div class="foot-right-1">
            <img src="../assets/image/wx-1.jpg" alt="" />
            <p>官方微信<br />扫描二维码</p>
          </div>
          <div class="foot-right-2">
            <img src="../assets/image/wx-2.jpg" alt="" />
            <p>官方微信<br />扫描二维码</p>
          </div>
        </div>
      </div>
    </div>
</template>

<script>
    export default {
        
    }
</script>

<style lang="scss" scoped>
*{
    margin: 0;
    padding: 0;
}
a{
    text-decoration: none;
    flex-shrink:0;
}
ul{
    list-style: none;
}
.container{
    margin:0 auto;
    width: 100%;
    height: 128px;
}

/* 九楼跳转页面css */
.foot-top {
    display:flex;
    height: 416px;
    width: 100%;
    background-color:rgb(243, 246, 248);
    position: relative;
}
.foot-top-ul{
    width: 870px;
    height: 251px;
    display: flex;
    margin-left: 111px;
    margin-right: 30px;
}

.foot-top-1 a h3{
    color: #000;
    font-size: 18px;
    line-height: 36px;
    font-weight: 700;
}
.foot-top-2 a h3{
    color: #000;
    font-size: 18px;
    line-height: 36px;
    font-weight: 700;
}
.foot-top-3 a h3{
    color: #000;
    font-size: 18px;
    line-height: 36px;
    font-weight: 700;
}
.foot-top-4 a h3{
    color: #000;
    font-size: 18px;
    line-height: 36px;
    font-weight: 700;
}
.foot-top-5 a h3{
    color: #000;
    font-size: 18px;
    line-height: 36px;
    font-weight: 700;
}
.foot-top-6 a h3{
    color: #000;
    font-size: 18px;
    line-height: 36px;
    font-weight: 700;
}
.foot-top-ul h3{
    margin-right: 64px;
    margin-top: 86px;
    margin-bottom: 36px;
}
.foot-top-ul li{
    color: #666;
    font-size: 15px;
    line-height: 30px;
}
.foot-top-right{
    position: relative;
    width: 500px;
    height: 251px;
}
.foot-top-right h3{
    color: #258bc9;
    font-size: 30px;
    list-style: 30px;
    font-weight: 700;
    position: absolute;
    top: 81px;
    right: 30px;
}
.foot-top-right p{
    position: absolute;
    top: 135px;
    right: 30px;
    color: #666;
    line-height: 24px;
    font-size: 16px;
}
.foot-top-text{
    font-size: 14px;
    height: 48px;
    line-height: 48px;
    padding:0 40px 0 25px;
    border-radius: 30px;
    background-color: #fff;
    box-sizing: border-box;
    width: 251px;
    position: absolute;
    top: 212px;
    right: 30px;
    color: #666;
}
.foot-top-text::after{
    background: url(../assets/image/up.png) no-repeat center center;
    position: absolute;
    right: 25px;
    top: 0;
    z-index:1;
    width: 12px;
    height: 100%;
    content: '';
}
.foot-top-text:hover{
    background-color: #258bc9;
    color: #fff;
}
/* 十楼 底部 */
.foot{
    display: flex;
    justify-content: space-around;
}
.foot-left{
    width: 631px;
    height: 131px;
    margin-top: 36px;
}
.foot-left ul{
    display:flex;
    position: relative;
}
.foot-left ul li{
    color: #666;
    margin-right: 20px;
    font-size: 14px;
}
.foot-left ul a li span:nth-child(1){
    position: absolute;
    left: 65px;
}
.foot-left ul a:nth-child(2) li span{
    position: absolute;
    left: 140px;
}
.foot-left ul a:nth-child(3) li span{
    position: absolute;
    left: 217px;
}
.foot-left img{
    margin-right: 17px;
}
.foot-left p{
    margin-top: 19px;
    font-size: 14px;
    color:#666;
    margin: 15px auto 12px;
}
.foot-right{
    width: 493px;
    height: 131px;
    display: flex;
    justify-content: space-between;
}
.foot-right-1{
    display: flex;
}
.foot-right-1 img{
    margin-top: 39px;
    width: 114px;
    height: 114px;
}
.foot-right-1 p{
    margin-top: 70px;
    margin-left: 30px;
}
.foot-right-2{
    display: flex;
}
.foot-right-2 img{
    margin-top: 39px;
    width: 114px;
    height: 114px;
}
.foot-right-2 p{
    margin-top: 70px;
    margin-left: 30px;
}
</style>